<template>
  <view class="container">
    <car-info :info="record">
      <ve-cell label="年检单号" v-if="record.inspectionNo">{{ record.inspectionNo || '-' }}</ve-cell>
    </car-info>

    <ve-card title="年检信息" type="none" fold="true">
      <ve-cell-val label="年检单关联门店" :value="record.siteName" />
      <ve-cell-val label="本次年检日期" :value="record.inspectionTime" />
      <ve-cell label="年检厂">{{ record.location || '-' }}</ve-cell>
      <ve-cell label="年检证">
        <preview-button title="查看年检证" :fileId="record.inspectionFileId" />
      </ve-cell>
      <ve-cell-val label="年检有效期至" :value="record.planTime" />

      <ve-cell-val label="负责人" :value="record.undertaker" />
      <ve-cell label="关联订单号">
        <view>
          {{ record.orderNo || '-' }}
          <view class="line-ellipsis" v-if="record.giveStaffName" style="width: 400rpx">交车人：{{ record.giveStaffName }}</view>
        </view>
      </ve-cell>
      <ve-cell label="承租人信息">
        <div>
          <template v-if="record.memberName && record.memberPhone"> {{ record.memberName }} | {{ record.memberPhone }} </template>
          <template v-else>-</template>
        </div>
      </ve-cell>

      <ve-cell label="备注">{{ record.remark || '-' }}</ve-cell>
      <ve-cell label="照片" layout="vertical">
        <ve-upload v-model="record.fileIdList" disabled></ve-upload>
      </ve-cell>
    </ve-card>

    <ve-card title="年检费用" type="none" fold="true">
      <ve-cell-price label="年检费" :value="record.inspectionAmount" />
      <ve-cell label="费用备注">{{ record.remark || '-' }}</ve-cell>
    </ve-card>

    <!-- 已付款展示结算信息 -->
    <ve-card title="结算信息" type="none" fold="true" v-if="assetFeeInfo?.feeStatus == 1">
      <ve-cell-val label="结算时间" :value="assetFeeInfo.confirmTime" />
      <ve-cell-val label="结算方式" :value="assetFeeInfo.payTypeName" />
      <ve-cell-val label="结算账号" :value="assetFeeInfo.payAccountName" />
      <ve-cell-val label="供应商名称" :value="assetFeeInfo.customerName" />
      <ve-cell-val label="供应商收款账号" :value="assetFeeInfo.customerAccount" />
      <ve-cell-val label="结算备注" :value="assetFeeInfo.settlementRemark" />
      <ve-cell label="结算凭证" layout="vertical">
        <ve-upload v-model="assetFeeInfo.fileIdList" disabled></ve-upload>
      </ve-cell>
    </ve-card>
  </view>
</template>

<script setup>
  import { ref } from 'vue'
  import { onLoad } from '@dcloudio/uni-app'
  import { getInspectDetail } from '@/api/asset/car-inspect'
  import PreviewButton from '@/components/preview-button.vue'
  import CarInfo from '@/pages/common/components/car-info.vue'

  const record = ref({})
  const assetFeeInfo = ref(null)
  const getDetail = async (id) => {
    console.log(id.id)
    const res = await getInspectDetail({ id: id.id })
    if (res.code === 200) {
      const data = res.result
      record.value = data
      assetFeeInfo.value = data.assetFeeInfo
    }
  }

  onLoad((id) => {
    getDetail(id)
  })
</script>

<style lang="scss" scoped>
  .container {
    width: 100vw;
    height: auto;
    min-height: 100%;
    background: #f7f8fa;
    padding: 24rpx;
  }
</style>
